<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>行内非替换元素</title>
    <style>
        .content {
            /* 1 宽高设置无效 */
            width: 200px;
            height: 300px;
            background: #F00;
            /* 2 padding会增加元素内边距，但不会占据空间 */
            /* padding: 40px; */
            /* 3 border会增加元素边框，但不会占据空间 */
            border: 11px solid #000;
            /* 4 上下margin设置无效 */
            margin-bottom: 80px;
        }
    </style>
</head>
<body>
    <span class="content">我是span哈哈哈</span>
    hhhhh
    <div>我是box元素</div>
</body>
</html>